<template>
    <div>
        <van-nav-bar title="注册" />
        <van-form @submit="onSubmit">
            <van-field v-model="username" name="用户名" label="用户名" placeholder="用户名" 
                :rules="[{ required: true, message: '请填写用户名' }]" />
            <van-field v-model="password" type="password" name="密码" label="密码" placeholder="密码"
                :rules="[{ required: true, message: '请填写密码' }]" />
            <div style="margin: 16px;">
                <van-button  block type="info" native-type="submit" color="#07C160">注册</van-button>
            </div>
            <div class="text-right">
                <router-link to="/login">有账号，去登录</router-link>
            </div>
        </van-form>
    </div>
</template>


<script>
import { register } from "@/api/user";
import { Notify } from "vant";
export default {
  data() {
    return {
      username: 'admin',
      password: 'admin',
    };
  },
  methods: {
    onSubmit() {
      register({
        username:this.username,
        password:this.password
      }).then(res=>{
          // 提示用户，注册成功
          Notify({ type: "success", message: "注册成功" });
          // 存储token
          this.$router.push("/login");
      }).catch(err=>{
        console.warn(err);
      })


    },
  },
};

</script>

<style lang="scss" scoped>
    .text-right{
        margin-right: 30px;
        font-size: 30px;
        text-align: right;
    }
</style>